<template>
	<zkView ref="zkView" v-slot:uContainer>
		<view class="container">
			<view class="banner">
				<image mode="widthFix" src="/static/home/hotTop.png"> </image>
			</view>
			<view class="content">
				<view class="list">
					<view class="proItem" v-for="pro in proList" :key="pro" @click="toDetail(pro._id)">
						<view class="itemThumb">
							<image mode="aspectFill" :src="pro.thumb||'/static/placeholder.png'">
							</image>
							<text>已售{{pro.sales_volume}}</text>
						</view>
						<view class="itemH1">
							<block v-if="pro.label&&pro.label.length>0">
								<text class="label" v-for="label in pro.label" :key="label">{{label}}</text>
							</block>
							<text class="name">{{pro.name}}</text>
						</view>
						<view class="itemH2">
							<view class="price">
								<text>￥</text>
								<rich-text v-if="$store.state.login.role===1" :nodes="formatPrice(pro.price_active,2)" />
								<rich-text v-if="$store.state.login.role===2" :nodes="formatPrice(pro.price_vip,2)" />
								<rich-text v-if="$store.state.login.role===9" :nodes="formatPrice(pro.price_vip,2)" />
								<text>￥</text>
								<rich-text :nodes="formatPrice(pro.price_original,1)" />
							</view>
							<view @click.stop="openSpuPop(pro)">
								<uni-icons type="plus" size="40rpx"></uni-icons>
							</view>
						</view>
						<view class="itemH3" v-if="pro.tag&&pro.tag.length>0">
							<text v-for="tag in pro.tag" :key="tag">{{tag}}</text>
						</view>
					</view>
					<view class="noMore">
						<text>触到底线了哦~</text>
					</view>
				</view>
			</view>
		</view>
	</zkView>
	<spuPopup ref="spuRef" @popupChange="popupChange" @popupCart="toCart" @popupBooking="toBooking" />
</template>

<script>
	import indexJs from './index.js';
	import mixins from '@/common/mixins.js';
	import spuPopup from '@/components/spuPopup/spuPopup.vue';
	export default {
		components: {
			spuPopup
		},
		mixins: [mixins],
		...indexJs
	};
</script>

<style lang="scss" scoped>
	@import './index.scss';
</style>